<template>
  <div class="mycenter">
    <div class="top">
      <div class="touxiang"></div>
      <p>昵称</p>
    </div>
    <div class="list">
      <ul>
        <li><van-icon size="40" name="star" color="#7FADEC"/><p>我的收藏</p></li>
        <li><van-icon size="40" name="smile-comment" color="#FD948D"/><p>我的评论</p></li>
        <li><van-icon size="40" name="good-job" color="#6EDCAE"/><p>我的点赞</p></li>
        <li><van-icon size="40" name="eye" color="#9798E7"/><p>浏览历史</p></li>
      </ul>
    </div>
    <div class="user_list">
      <ul>
        <li><div><van-icon name="balance-list-o" /><span>我的订单</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="vip-card-o" /><span>我的会员</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="comment-circle-o" /><span>优惠卡券</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="bookmark-o" /><span>任务中心</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="records-o" /><span>用户反馈</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="link-o" /><span>邀请好友</span></div><van-icon name="arrow" /></li>
        <li><div><van-icon name="shield-o" /><span>系统帮助</span></div><van-icon name="arrow" /></li>
      </ul>
    </div>

    <div class="content"></div>
  </div>
</template>

<script>
export default {};
</script>
<style lang="less" scoped>
.content{
  padding-bottom: 70px;
}
.top {
  padding: 0 15px;
  background-color: #f0f0f0;
  display: flex;
  align-items: center;
  height: 70px;
  .touxiang{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #a586867b;
    margin-right: 20px;
  }
}
.list{
  margin-top: 10px;
  padding: 0 15px;
  ul{
   display: flex;
   justify-content: space-between;
   align-items: center;
   li{
    text-align: center;
    p{
      font-size: 16px;
    }

   }
  }
  
}
.user_list{
  padding: 0 15px;
  ul{
    li{
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 10px;
      height: 50px;
      span{
        margin-left: 10px;
      }
    }
  }
}
</style>
